<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8" />
    <title>快速初始化-显示加载的图片</title>
    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
    <style type="text/css">
        body {
            margin: 0;
        }
    </style>
</head>
<body>

<script type="text/javascript">

	var config = {
		type: Phaser.AUTO,
		width: 800,
		height: 600,
		physics: {
			default: 'arcade',
			arcade: {
				gravity: { y: 0 },
				debug: false
			}
		},
		scene: {
			preload: preload,
			create: create,
			update: update
		}
	};
	//初始化
	var game = new Phaser.Game(config);
	var bullets;
	var lastFired = 0;
	var speed;
	//预加载图片或者资源
    function preload ()
    {
		this.load.image('sky', './assets/sky.png');
		//此处的money.png一定要是序列帧png
		this.load.image('monkey','./assets/monkey.png');
		this.load.image('bullet','./assets/bullet.png');
    }

	//显示预加载的资源或者图片
    function create ()
    {
		//设置子弹
		var Bullet = new Phaser.Class({

			Extends: Phaser.GameObjects.Image,

			initialize:function Bullet (scene)
			{
				Phaser.GameObjects.Image.call(this, scene, 0, 0, 'bullet');

				this.speed = Phaser.Math.GetSpeed(400, 1);
			},

			fire: function (x, y)
			{
				this.setPosition(x, y - 50);

				this.setActive(true);
				this.setVisible(true);
			},

			update: function (time, delta)
			{
				this.y -= this.speed * delta;

				if (this.y < -50)
				{
					this.setActive(false);
					this.setVisible(false);
				}
			}

		});
		
		//初始化子弹库
		bullets = this.add.group({
			classType: Bullet,
			maxSize: 1,
			runChildUpdate: true
		});
		
		speed = Phaser.Math.GetSpeed(300, 1);
	
	}
	//每帧都要调用的方法
    function update (time, delta)
    {
		//获取子弹发射
		var bullet = bullets.get();
        if (bullet){
		
            bullet.fire(player.x, player.y);
            lastFired = time + 50;
			
        }

    }

</script>

</body>
</html>